<template>
	<div class="content">
		<div class="base" style="margin-bottom: 10px;">
			<Form inline class="fl">
				<Button type="primary" v-on:click="modal1 = true;">批量转出</Button>
			</Form>
		</div>
		<Table stripe :columns="columns" :data="conditionQuery" ref="table" :loading="loading"></Table>
		<Page :total="info" show-elevator :page-size="pageSize" show-total @on-change="cuctGetQuery" :current.sync="page"></Page>
		<Modal v-model="modal1" title="批量转出" width="60%" :mask-closable="false">
			<p>
				<Form label-position="right" :label-width="10">
					<div class="canshu" v-for="(item,index) of address" :key="index">
						<FormItem label="">
							到账地址
							<Input class="w300" v-model="item.toAddress" />&nbsp;&nbsp;数量&nbsp;
							<Input class="w80" v-model="item.num" />&nbsp;&nbsp;选择币种&nbsp;
							<Select class="w80" v-model="item.coinId">
								<Option value="1">EXUU</Option>
								<Option value="2">USDT</Option>
							</Select>
							<Icon style="cursor: pointer;margin-left: 10px;" type="ios-remove-circle" size="21" color="rgb(237, 64, 20)" @click="delRatios(index)" :class="index == 0 ? 'hidden' : ''"></Icon>
							<Icon style="cursor: pointer;margin-right: 10px;" type="ios-add-circle" size="21" color="#2d8cf0" @click="addRatios" :class="index != address.length - 1 || address.length == 20? 'hidden' : ''"></Icon>
						</FormItem>
					</div>
				</Form>
			</p>
			<div slot="footer">
				<Button type="text" size="large" @click="clear">取消</Button>
				<Button type="primary" size="large" @click="confirm">转出</Button>
			</div>
		</Modal>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				dcShow: false,
				dataValue: ['', ''], // 时间段值
				conditionQuery: [], // 条件查询的结果
				userDetail: [], //会员详情
				info: null, // 总条数
				page: 1, // 页数
				pageSize: 20, // 每页多少条
				current: 1,
				tradeId: '',
				userId: '',
				typeId: '',
				modal: false,
				modal1: false, //充值会员详情
				myUpList: [],
				downList: [],
				jsonData: [],
				loading: true,
				collectList: '0.00',
				address: [{
					toAddress: '',
					num: '',
					coinId: '',
				}],
				columns: [{
						title: '转出编号',
						key: 'tradeId',
						align: 'center',
						render: (h, params) => {
							return h('div', params.row.tradeId == null ? '#' : params.row.tradeId);
						}
					},
					{
						title: '到账地址',
						key: 'toAddress',
						align: 'center',
						render: (h, params) => {
							return h('div', params.row.toAddress == null ? '#' : params.row.toAddress);
						}
					},
					{
						title: '数量',
						key: 'actualNum',
						align: 'center',
						render: (h, params) => {
							return h('div', params.row.actualNum == null ? '#' : params.row.actualNum);
						}
					},
					{
						title: '币种名称',
						key: 'coinName',
						align: 'center',
						render: (h, params) => {
							return h('div', params.row.coinName == null ? '#' : params.row.coinName);
						}
					},
					{
						title: '所在区块',
						key: 'block',
						align: 'center',
						render: (h, params) => {
							return h('div', params.row.block == null ? '#' : params.row.block);
						}
					},
					{
						title: '交易Hash',
						key: 'txId',
						align: 'center',
						render: (h, params) => {
							return h('div', params.row.txId == null ? '#' : params.row.txId);
						}
					},
					{
						title: '币种技术',
						key: 'coinType',
						align: 'center',
						render: (h, params) => {
							return h('div', params.row.coinType == null ? '#' : params.row.coinType);
						}
					},
					{
						title: '状态',
						key: 'statusId',
						align: 'center',
						render: (h, params) => {
							return h('div', params.row.statusId == null ? '#' : this.statusIdFormart(params.row.statusId));
						}
					},
					{
						title: '备注',
						key: 'remark',
						align: 'center',
						render: (h, params) => {
							return h('div', params.row.remark == null ? '#' : params.row.remark);
						}
					},
					{
						title: '创建时间',
						key: 'createTime',
						align: 'center',
						sortable: true,
						render: (h, params) => {
							return h('div', params.row.createTime == null ? '#' : this.stringToTime(params.row.createTime));
						}
					}
				],
			}
		},
		mounted() {
			this.$Message.config({ // 配置弹窗的位置
				top: 250
			});
			this.getQuery(); // 充值列表查询
		},
		methods: {
			getTime(daterange) {
				this.dataValue = daterange;
			},
			exportData() { // 导出
				this.jsonData = [];
				this.dcShow = true;
				this.axios.get('/admin/accounting/recharge/getRechargeList', {
					params: {
						current: this.page, // 当前页【可选，默认1】
						size: this.pageSize, // 每页记录数【可选，默认20】
						uuid: this.userId,
						tradeId: this.tradeId,
						startTime: this.dataValue[0] == "" ? "" : this.dataValue[0] + ' 00:00:00',
						endTime: this.dataValue[1] == "" ? "" : this.dataValue[1] + ' 23:59:59',
						rechargeType: 2
					}
				}).then(res => {
					if(res.data.code == 200) {
						this.axios.get('/admin/accounting/recharge/getRechargeList', {
							params: {
								current: this.page, // 当前页【可选，默认1】
								size: res.data.data.total, // 每页记录数【可选，默认20】
								tradeId: this.tradeId,
								uuid: this.userId,
								startTime: this.dataValue[0] == "" ? "" : this.dataValue[0] + ' 00:00:00',
								endTime: this.dataValue[1] == "" ? "" : this.dataValue[1] + ' 23:59:59',
								rechargeType: 2
							}
						}).then(res => {
							if(res.data.code == 200) {
								this.downList = res.data.data.records;
								this.downList.forEach((row, index) => {
									this.jsonData.push({
										receiveUuid: this.downList[index].receiveUuid,
										tradeId: this.downList[index].tradeId,
										num: this.Fixed(this.downList[index].num),
										coinType: this.coinIdFormat(this.downList[index].coinType),
										receiveName: this.downList[index].receiveName,
										rechargeName: this.downList[index].rechargeName,
										rechargePhone: this.downList[index].rechargePhone,
										remark: this.downList[index].remark,
										createTime: this.stringToTime(this.downList[index].createTime),
									})
								})
								let str = `扣除会员ID,扣除编号,扣除编号,币种类型,账户,操作人名称,操作人手机号,备注,充值时间\n`;
								this.downLoad(this.jsonData, str, '充值列表');
							}
						})
					}
				})
			},
			getQuery() { // 充值列表查询
				this.loading = true;
				let token = localStorage.getItem('mytoken')
				this.axios.get('/admin/accounting/supperTransfer', {
					params: {
						current: this.page, // 当前页【可选，默认1】
						size: this.pageSize, // 每页记录数【可选，默认20】
						uuid: '',
						tradeId: '',
						startTime: '', // 起始日期
						endTime: '', // 结束日期
						rechargeType: 2,
					}
				}).then(res => {
					if(res.data.code == 200) {
						this.conditionQuery = res.data.data.records;
						this.conditionQuery.forEach((row, index) => {
							this.conditionQuery[index].paymentDate = '\t' + this.stringToTime(row.paymentDate);
						})
						this.info = res.data.data.total;
						this.loading = false;
					}
				})
			},
			cuctGetQuery(page) { // 充值列表分页查询
				this.loading = true;
				let token = localStorage.getItem('mytoken')
				this.axios.get('/admin/accounting/recharge/getRechargeList', {
					params: {
						current: page, // 当前页【可选，默认1】
						size: this.pageSize, // 每页记录数【可选，默认20】
						uuid: this.userId,
						tradeId: this.tradeId,
						startTime: '', // 起始日期
						endTime: '', // 结束日期
						rechargeType: 2
					}
				}).then(res => {
					if(res.data.code == 200) {
						this.conditionQuery = res.data.data.records
						this.conditionQuery.forEach((row, index) => {
							this.conditionQuery[index].paymentDate = '\t' + this.stringToTime(row.paymentDate);
						})
						this.info = res.data.data.total;
						this.loading = false;
					}
				})
			},
			getConditionQuery() { // 充值列表条件查询
				this.loading = true;
				let token = localStorage.getItem('mytoken')
				this.page = 1;
				this.axios.get('/admin/accounting/recharge/getRechargeList', {
					params: {
						current: this.page, // 当前页【可选，默认1】
						size: this.pageSize, // 每页记录数【可选，默认20】
						uuid: this.userId,
						tradeId: this.tradeId,
						startTime: this.dataValue[0] == "" ? "" : this.dataValue[0] + ' 00:00:00',
						endTime: this.dataValue[1] == "" ? "" : this.dataValue[1] + ' 23:59:59',
						rechargeType: 2
					}
				}).then(res => {
					if(res.data.code == 200 || res.data.code == 500) {
						this.conditionQuery = res.data.data.records;
						this.conditionQuery.forEach((row, index) => {
							this.conditionQuery[index].paymentDate = '\t' + this.stringToTime(row.paymentDate);
						})
						this.info = res.data.data.total;
						this.loading = false;
					}
				})
			},
			addRatios() {
				this.address.push({
					toAddress: '',
					num: '',
					coinId: '',
				})
			},
			delRatios(i) {
				let $this = this;
				this.$Modal.confirm({
					title: '删除',
					content: '是否要删除转出信息？',
					onOk: function() {
						$this.address.splice(i, 1);
					}
				});
			},
			confirm() {
				let $this = this;
				for(let i = 0; i < $this.address.length; i++) {
					if(!$this.address[i].toAddress) {
						$this.$Message.info('请输入第' + (i + 1) + '行到账地址');
						return false;
					}
					if(!$this.address[i].num) {
						$this.$Message.info('请输入第' + (i + 1) + '行数量');
						return false;
					}
					if(!$this.address[i].coinId) {
						$this.$Message.info('请选择第' + (i + 1) + '行币种');
						return false;
					}
				}
				let value = '';
				this.$Modal.confirm({
					title: '确认转出？',
					render: (h) => {
						return h('Input', {
							props: {
								value: value,
								autofocus: true,
								placeholder: '请输入审核密码',
								type: 'password'
							},
							on: {
								input: (val) => {
									value = val;
								}
							}
						})
					},
					onOk: function() {
						if(!value) {
							$this.$Message.info('请输入审核密码');
							return false;
						}
						$this.address[0].password = value;
						$this.axios.post('/admin/accounting/supperTransfer', $this.address, {
							arrayFormat: 'indices',
							allowDots: true
						}).then(res => {
							if(res.data.code == 200) {
								$this.getQuery();
								$this.$Message.info(res.data.msg);
								$this.modal1 = false;
								$this.address = [];
							}
						})
					}
				})
			},
			clear() {
				this.modal1 = false;
				this.address = [{
					toAddress: '',
					num: '',
					coinId: '',
				}];
			},
			statusIdFormart(status) {
				switch(Number(status)) {
					case 1:
						return '成功';
						break;
					case 2:
						return '失败';
						break;
					case 3:
						return '转账中';
						break;
					case 4:
						return '待转出';
						break;
				}
			}
		}
	}
</script>

<style>
	.w300 {
		width: 300px;
	}
	
	.hidden {
		display: none;
	}
</style>